<template>
  <div class="home">
    <redBox>
      <button @click="toAbout">点击跳转about页面</button>
    </redBox>
    <greenBox></greenBox>
  </div>
</template>
<script>
import redBox from '@/views/home/component/redBox.vue'
import greenBox from './component/greenBox.vue'

export default {
  name: 'HomeView',
  components: {
    redBox,
    greenBox
  },
  methods: {
    toAbout () {
      this.$router.push('/about')
    }
  }
}
</script>
<style lang="less" scoped>
.home {
  display: flex;
  height: 100px;
}
</style>
